<template>
	<div class="">
		<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="68px">
			<el-form-item label="公司名称" prop="customName" size="small">
				<el-input v-model="queryParams.customName" placeholder="请输入公司名称" clearable class="input-width"
					@keyup.enter.native="searchList" />
			</el-form-item>
			<el-form-item label="手机号码" prop="callPhone">
				<el-input v-model="queryParams.callPhone" placeholder="请输入手机号码" clearable class="input-width"
					@keyup.enter.native="searchList" />
			</el-form-item>
			<el-form-item label="联系人" prop="callName">
				<el-input v-model="queryParams.callName" placeholder="请输入联系人" clearable class="input-width"
					@keyup.enter.native="searchList" />
			</el-form-item>
			<el-form-item label="销售经理" prop="customManager">
				<el-input v-model="queryParams.customManager" placeholder="请输入销售经理" clearable class="input-width"
					@keyup.enter.native="searchList" />
			</el-form-item>
			<el-form-item label="渠道" prop="source" v-if="type == 'custom' || type == 'public'">
				<el-input v-model="queryParams.source" placeholder="请输入渠道" clearable class="input-width"
					@keyup.enter.native="searchList" />
			</el-form-item>
			<el-form-item label="合同类别" prop="contractType" v-if="type == 'contract' && !hide">
				<el-select v-model="queryParams.contractType" placeholder="请选择合同类别" clearable class="input-width custom-select"
					@clear="clearValue">
					<el-option v-for="dict in dict.type.contract_type" :key="dict.value" :label="dict.label"
						:disabled="dict.label.includes('托管') && optionDisabled" :value="dict.value" />
				</el-select>
			</el-form-item>

			<el-form-item label="托管类别" prop="taskType" v-if="type == 'contract' && taskType > -2">
				<el-select v-model="queryParams.taskType" placeholder="请选择托管类别" clearable class="input-width"
					@clear="clearTaskValue">
					<el-option v-for="item in financeContractTypeList" :key="item.id" :label="item.name" :value="item.id" />
				</el-select>
			</el-form-item>
			<el-form-item label="时间范围" prop="" v-if="type == 'contract' && taskType > -2">
				<el-date-picker v-model="queryParams.timeFrame" type="daterange" align="right" unlink-panels range-separator="至"
					start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions" value-format="yyyy-MM-dd">
				</el-date-picker>
			</el-form-item>

			<el-form-item>
				<el-button type="primary" icon="el-icon-search" size="mini" @click="searchList">搜索</el-button>
				<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
			</el-form-item>
			<el-form-item v-if="status == 0 && type == 'custom' && isDelete == 0">
				<el-button type="warning" plain icon="el-icon-download" size="mini" v-if="topManagerFlag"
					@click="handleExport">导出</el-button>
				<el-button type="info" plain icon="el-icon-upload2" size="mini" v-if="topManagerFlag"
					@click="handleImport">导入</el-button>
			</el-form-item>
			<el-form-item v-if="status == 5 || status == 6 && type == 'public'">
				<el-button icon="el-icon-refresh" size="mini" @click="getSelectEvent(true)">同意</el-button>
				<el-button icon="el-icon-refresh" size="mini" @click="getSelectEvent(false)">拒绝</el-button>
			</el-form-item>
			<el-form-item>
				<!-- class="allTotal" -->
				<el-link>总计：{{ total }} 条</el-link>
			</el-form-item>
			<!-- <el-form-item v-if="isPay == 1" style="font-size: 14px;color: #606266;">
				<span>订单总计：{{ Allcontract_amount }} 元&nbsp;&nbsp;</span>
				<span>回款总计：{{ Allpaid_amount }} 元&nbsp;&nbsp;</span>
				<span>欠收总计：{{ Allunpaid_amount }} 元 </span>
			</el-form-item> -->
		</el-form>
		<div v-if="isPay == 1"
			style="display: flex;justify-content: flex-end;margin-bottom: 10px;font-size: 14px;color: #606266;">
			<span>订单总计：</span>
			<span style="font-size: 16px;font-weight: bold;margin-right: 10px;">{{ Allcontract_amount }}元</span>
			<span>回款总计：</span>
			<span style="font-size: 16px;font-weight: bold;margin-right: 10px;">{{ Allpaid_amount }}元</span>
			<span>欠收总计：</span>
			<span style="font-size: 16px;font-weight: bold;margin-right: 10px;">{{ Allunpaid_amount }} 元</span>
		</div>
	</div>
</template>

<script>
import { contractCount } from "@/api/contract/info";
export default {
	name: 'searchOption',
	dicts: ["contract_type"],
	props: {
		type: {
			type: String,
			default: ''
		},
		status: {
			type: [Number, String],
			default: null
		},
		isDelete: {
			type: [Number, String],
			default: 0
		},
		total: {
			type: [Number, String],
			default: 0
		},
		taskType: {
			type: [Number, String],
			default: -2
		},
		isPay: {
			type: [Number, String],
			default: null
		}
	},
	data() {
		return {
			hide: false,
			optionDisabled: false,
			topManagerFlag: false,
			Allpaid_amount: 0,
			Allunpaid_amount: 0,
			Allcontract_amount: 0,
			financeContractTypeList: this.$store.state.user.financeContractTypeList,
			// 查询参数
			queryParams: {
				pageNum: 1,
				pageSize: 30,
				customName: null,
				source: null,
				contractType: null,
				province: null,
				city: null,
				region: null,
				taskType: null,
				taskTypeFlag: false,
				contractTypeFlag: false,
				adressDetail: null,
				bussLicenseImage: null,
				bussLicenseImageMinor: null,
				legalIdCardFront: null,
				legalIdCardBack: null,
				callPhone: null,
				callName: null,
				customManager: null,
				gmtCreate: null,
				successTime: null,
				degree: null,
				timeFrame: null
			},
			pickerOptions: {
				shortcuts: [{
					text: '最近一周',
					onClick(picker) {
						const end = new Date();
						const start = new Date();
						start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
						picker.$emit('pick', [start, end]);
					}
				}, {
					text: '最近一个月',
					onClick(picker) {
						const end = new Date();
						const start = new Date();
						start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
						picker.$emit('pick', [start, end]);
					}
				}, {
					text: '最近三个月',
					onClick(picker) {
						const end = new Date();
						const start = new Date();
						start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
						picker.$emit('pick', [start, end]);
					}
				}]
			},
		};
	},
	mounted() {
		// 检查登录账户是否为销售主管，如果不是则不显示导入导出
		let roles = this.$store.state.user.roles;
		if (roles.length > 0) {
			roles.forEach(item => {
				if (item == 'topManager' || item == 'admin') {
					this.topManagerFlag = true;
					return
				}
			});
		}
	},
	methods: {
		// 触发父组件搜索
		searchList() {
			this.$emit('searchList', this.queryParams);
			this.getContractCount(this.queryParams.customManager);
		},
		// 触发父组件重置
		resetQuery() {
			this.resetForm("queryForm");
			this.searchList();
		},
		// 父组件 导出
		handleExport() {
			this.$emit('handleExport', this.queryParams)
		},
		// 父组件 导入
		handleImport() {
			this.$emit('handleImport', this.queryParams)
		},
		// 父组件 同意  拒绝
		getSelectEvent(flag) {
			this.$emit('getSelectEvent', flag)
		},
		// 合同类别清空时
		clearValue() {
			this.queryParams.contractTypeFlag = true;
		},
		// 续费类别
		clearTaskValue() {
			this.queryParams.taskTypeFlag = true;
		},
		// 获取统计数据
		getContractCount(username) {
			console.log(this.hide);
			let params = {
				customManager: username,
				contractType: this.hide ? 2 : 10,
			}
			contractCount(params).then(res => {
				if (res.code == 200) {
					this.Allpaid_amount = res.data.allPaidAmount;
					this.Allunpaid_amount = res.data.allUnpaidAmount;
					this.Allcontract_amount = res.data.allContractAmount;
				}
			})
		}
	}
};
</script>

<style scoped>
.el-select /deep/ .el-input__inner {
	font-size: 10px;
	/* 修改为你想要的字体大小 */
}

.el-date-editor--daterange /deep/.el-input__inner {
	width: 260px;
}

.el-form-item {
	margin-bottom: 10px;
}
</style>